1<template>
  <view class="main">

    <view v-if="islogin" class="">
      <uni-section title="基本信息" type="line">
        <uni-list>
          <uni-list-item @click="modifyLogo" :clickable="true" :title="userinfo.user.username" :thumb="userinfo.logo"
            show-arrow></uni-list-item>
          <uni-list-item thumb="/static/phone.png" title="手机" show-arrow :note="userinfo.info.phone"></uni-list-item>
          <uni-list-item thumb="/static/email.png" title="邮箱" show-arrow :note="userinfo.info.email"></uni-list-item>
          <uni-list-item title="注册日期" :note="tools.formatDate(userinfo.user.regTime,'yyyy-MM-dd')"></uni-list-item>

        </uni-list>
      </uni-section>

      <uni-section title="功能" type="line">
        <uni-list>
          <uni-list-item clickable @click="logout" thumb="/static/logout.png" title="安全退出" show-arrow></uni-list-item>
        </uni-list>
      </uni-section>

    </view>

    <view v-if="!islogin" class="">
      <uni-forms>
        <uni-forms-item label="用户名">
          <uni-easyinput v-model="user.username" />
        </uni-forms-item>
        <uni-forms-item label="密码">
          <uni-easyinput type="password" v-model="user.password" />
        </uni-forms-item>
        <uni-forms-item>
          <button @click="login" type="primary" size="default">登录</button>
          <button type="warn" size="default">重填</button>
          <button @click="reg" type="default" size="default">注册</button>
        </uni-forms-item>
      </uni-forms>

    </view>

  </view>
</template>

<script setup>
  import {
    ref
  } from 'vue'
  import {
    storeToRefs
  } from 'pinia'
  import {
    api,
    tools,
    BASE_URL,
    tokeninfo
  } from '@/js/api.js'

  import userstore from '@/store/userinfo.js'

  const {
    islogin,
    userinfo
  } = storeToRefs(userstore())
  const {
    queryUser
  } = userstore()

  const modifyLogo = () => {
    // #ifdef MP-WEIXIN
    uni.chooseMedia({
      mediaType: ['image'],
      count: 1,
      success: (info) => {
        console.log("图片信息", info)
        uploadLogo(info.tempFiles[0].tempFilePath)
      }
    })
    // #endif

    // #ifndef MP-WEIXIN
    uni.chooseImage({
      count: 1,
      success: (info) => {
        console.log("图片信息", info)
        uploadLogo(info.tempFilePaths[0])
      }
    })
    // #endif
  }

  const uploadLogo = (filePath) => {
    uni.uploadFile({
      filePath: filePath,
      name: 'file',
      url: BASE_URL + '/user/info/logo',
      header: {
        Authorization: tokeninfo.load()
      },
      complete: (data) => {
        queryUser()
      }
    })
  }


  const user = ref({
    "username": "hhy",
    "password": "123456"
  })

  const login = () => {
    api.post("/auth", user.value, (data) => {
      if (data.success) {
        queryUser()
      }
      uni.showModal({
        title: '登录',
        content: data.message
      })
    })
  }

  const logout = () => {
    uni.showLoading({
      title: '安全退出中...'
    })
    api.delete('/auth', {}, (data) => {
      queryUser(() => {
        uni.hideLoading()
      })
    })
  }

  const reg = () => {
    uni.navigateTo({
      url: './reg'
    })
  }
</script>

<style scoped>
  .main {
    padding: 1rem;
  }

  button {
    margin: 0.5rem;
  }
</style>